class CustomTagComponent {
  eGui;
  eButton;
  eventListener;

  // params.data.tag == params.value
  // params : {value: '药品|通告公告', valueFormatted: null, getValue: ƒ, setValue: ƒ, formatValue: ƒ, …}
  init(params) {
    // tag 组件 按钮, 从 "|" 进行分割
    this.eGui = document.createElement("div");
    const value = params.value.split("|");

    const els = [];
    for (const item of value) {
      const el = document.createElement("div");
      el.className = "cus-tag";
      el.textContent = item;
      el.style.backgroundColor = "#d1d2d2";
      el.style.padding = "0 5px";
      el.style.margin = "0px 3px";
      el.style.borderRadius = "5px";
      el.style.color = "black";
      el.style.cursor = "pointer";
      el.style.display = "inline-flex";
      el.style.alignItems = "center";

      this.eventListener = () => console.log("Software Launched");
      el.addEventListener("click", this.eventListener);
      els.push(el);
    }

    for (const el of els) {
      this.eGui.appendChild(el);
    }
  }

  getGui() {
    return this.eGui;
  }

  refresh() {
    return true;
  }

  destroy() {
    if (this.eButton) {
      this.eButton.removeEventListener("click", this.eventListener);
    }
  }
}
